<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <meta name="description" content=""/>
    <meta name="keywords" content=""/>
    <title>小说中心-登录</title>
    <link rel="stylesheet" href="/css/bootstrap.css"/>
    <link rel="stylesheet" href="/css/bootstrap-responsive.css"/>
    <script src="/js/bootstrap/bootstrap.js" type="text/javascript"></script>
    <script src="/js/bootstrap/prettify.js" type="text/javascript"></script>
    <script src="/js/jqery/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="/js/bootstrap/jqBootstrapValidation.js" type="text/javascript"></script>

    <style type="text/css">
        body {
            padding-top: 60px;
            padding-bottom: 40px;
            color: #BEBEC5;
        }
    </style>
    <script>
        $(function () {
            $("input,textarea,select").jqBootstrapValidation(
                    {
                        preventSubmit: true,
                        submitError: function ($form, event, errors) {
                            // Here I do nothing, but you could do something like display
                            // the error messages to the user, log, etc.
                        },

                        filter: function () {
                            return $(this).is(":visible");
                        }
                    }
            );


        });
    </script>
</head>
<body>
<#--<div>${msg}</div>-->
<div class="container-fluid">
    <form class="form-horizontal" action="/login" method="POST">
        <div class="control-group">

            <div class="controls">
                <legend>登录</legend>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label">用户名</label>

            <div class="controls">
                <input name="username" id="inputEmail" placeholder="username..." type="text"
                       required>

            </div>
        </div>
        <div class="control-group">
            <label class="control-label">Password</label>

            <div class="controls">
                <input type="password" minlength="5" name="password"
                       id="inputPassword" placeholder="password..."
                       maxlength="20" required>
            </div>
        </div>

        <div class="control-group">
            <label class="control-label">验证码</label>

            <div class="controls">
                <input type="text" name="validateCode"/>&nbsp;&nbsp;<img id="validateCodeImg" src="/validateCode"/>&nbsp;&nbsp;<a href="#"
                                                                                                                                  onclick="javascript:reloadValidateCode();">看不清？</a></li>
            </div>
        </div>

        <div class="control-group">
            <div class="controls">
                <label class="checkbox">
                    <input type="checkbox"> Remember me
                </label>
                <button type="submit" class="btn btn-info">Sign in</button>
            </div>
        </div>
    </form>
</div>
<script type="text/javascript">
    <!--
    function reloadValidateCode() {
        $("#validateCodeImg").attr("src", "/validateCode?data=" + new Date() + Math.floor(Math.random() * 24));
    }
    //-->
</script>
</body>
</html>
